<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>尺寸属性</title>
		<style>
			span{
				font-size: 2em;
				color: rgb(26,151,100);
				background-color: rgba(86,135,72,.1);
			}
			/*--------------最大、小宽高问题-----------*/
			div#container{/*权值：101*/
				background-color: #f0f0f0;
			}
			div.box{
				background-color: #ff0e42;
				color:#fff;
				width: 80%;
				/*最大宽度与普通宽度同时出现，以最大宽度为准*/
				ma x-wi dth:150px;
                /*最小宽度，页面承受最小宽度，小于尺寸，字体或者图片位置不变
				同时出现min-width和max-width，最小值大于最大值，*/
				min-width: 400px;
				
			}
		</style>
	</head>
	<body>
		<!--所有属性值的单位
		    常用单位： %、px 像素 绝对值、em 移动端 字体倍数
			常用颜色单位：网页三原色:红、绿、蓝、组成页面上的所有颜色
			             rgb（0~255，0~255,0~255）
						 rgba(0~255，0~255,0~255，0~)遮罩层
						 #rrggbb 十六进制     组成:0~9 a~z A~Z
						 常用十六进制：#000000 黑色  #ffffff 白色
						 简写十六进制：#ff0 #000 #fff
		-->
		<span>lorem</span>
		<!--自适应：最大、小宽高  最小和最大宽度-->
		<div id="container">
		<div class="box">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus ipsum, aliquam placeat, rem optio quam maxime saepe odio inventore sequi cupiditate enim. Esse expedita sunt, libero odio neque at mollitia.</div>	
		</div>
		
	</body>
</html>